﻿<!DOCTYPE html>
<html lang="en">
  <head>
    <!-- BEGIN META TAG -->
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta name="description" content="">
    <meta name="author" content="Custom Theme">
    <!-- END META TAG -->
    
    <!-- BEGIN SHORTCUT ICON -->
    <link rel="shortcut icon" href="img/favicon.ico">
    <!-- END SHORTCUT ICON -->
    
    <title>
      Search Result
    </title>
    
    
    <!-- BEGIN STYLESHEET -->
		<link href="css/bootstrap.min.css" rel="stylesheet"><!-- BOOTSTRAP CSS -->
		<link href="css/bootstrap-reset.css" rel="stylesheet"><!-- BOOTSTRAP CSS -->
		<link href="assets/font-awesome/css/font-awesome.css" rel="stylesheet"><!-- FONT AWESOME ICON CSS -->
		<link href="css/style.css" rel="stylesheet"><!-- THEME BASIC CSS -->
		<link href="css/style-responsive.css" rel="stylesheet"><!-- THEME RESPONSIVE CSS -->
		<link href="css/table-responsive.css" rel="stylesheet"><!-- TABLE RESPONSIVE CSS -->
    <!--[if lt IE 9]>
<script src="js/html5shiv.js">
</script>
<script src="js/respond.min.js">
</script>
<![endif]-->
     <!-- END STYLESHEET -->
     
  </head>
  <body>
    <!-- BEGIN SECTION-->
    <section id="container" class="">
	  <!-- BEGIN HEADER -->
        <header class="header white-bg">
           <!-- SIDEBAR TOGGLE BUTTON -->
			<div class="sidebar-toggle-box">
			  <div  data-placement="right" class="fa fa-bars tooltips">
			  </div>
			</div>
        <!-- SIDEBAR TOGGLE BUTTON  END-->
          <a href="index.html" class="logo">
            olive
            <span>
              admin
            </span>
          </a>
          <!-- START HEADER  NAV -->
        
        <nav class="nav notify-row" id="top_menu">
          
          <ul class="nav top-menu">
            <!-- START NOTIFY TASK BAR -->
            
            <li class="dropdown">
              <a data-toggle="dropdown" class="dropdown-toggle" href="#">
                <i class="fa fa-tasks">
                </i>
                <span class="badge bg-success">
                  6
                </span>
              </a>
              
              <ul class="dropdown-menu extended tasks-bar">
                <li class="notify-arrow notify-arrow-blue">
                </li>
                <li>
                  <p class="blue">
                    You have 6 pending tasks
                  </p>
                </li>
                <li>
                  <a href="#">
                    <div class="task-info">
                      <div class="desc">
                        Dashboard v1.3
                      </div>
                      <div class="percent">
                        40%
                      </div>
                    </div>
                    <div class="progress progress-striped">
                      <div class="progress-bar progress-bar-success set-40" role="progressbar" aria-valuenow="40" aria-valuemin="0" aria-valuemax="100" >
                        <span class="sr-only">
                          40% Complete (success)
                        </span>
                      </div>
                    </div>
                  </a>
                </li>
                <li>
                  <a href="#">
                    <div class="task-info">
                      <div class="desc">
                        Database Update
                      </div>
                      <div class="percent">
                        60%
                      </div>
                    </div>
                    <div class="progress progress-striped">
                      <div class="progress-bar progress-bar-warning set-60" role="progressbar" aria-valuenow="60" aria-valuemin="0" aria-valuemax="100" >
                        <span class="sr-only">
                          60% Complete (warning)
                        </span>
                      </div>
                    </div>
                  </a>
                </li>
                <li>
                  <a href="#">
                    <div class="task-info">
                      <div class="desc">
                        Iphone Development
                      </div>
                      <div class="percent">
                        87%
                      </div>
                    </div>
                    <div class="progress progress-striped">
                      <div class="progress-bar progress-bar-info set-87" role="progressbar" aria-valuenow="20" aria-valuemin="0" aria-valuemax="100" >
                        <span class="sr-only">
                          87% Complete
                        </span>
                      </div>
                    </div>
                  </a>
                </li>
                <li>
                  <a href="#">
                    <div class="task-info">
                      <div class="desc">
                        Mobile App
                      </div>
                      <div class="percent">
                        33%
                      </div>
                    </div>
                    <div class="progress progress-striped">
                      <div class="progress-bar progress-bar-danger set-33" role="progressbar" aria-valuenow="80" aria-valuemin="0" aria-valuemax="100" >
                        <span class="sr-only">
                          33% Complete (danger)
                        </span>
                      </div>
                    </div>
                  </a>
                </li>
                <li>
                  <a href="#">
                    <div class="task-info">
                      <div class="desc">
                        Dashboard v1.3
                      </div>
                      <div class="percent">
                        45%
                      </div>
                    </div>
                    <div class="progress progress-striped active">
                      <div class="progress-bar set-45" role="progressbar" aria-valuenow="45" aria-valuemin="0" aria-valuemax="100" >
                        <span class="sr-only">
                          45% Complete
                        </span>
                      </div>
                      
                    </div>
                  </a>
                </li>
                <li class="external">
                  <a href="#">
                    See All Tasks
                  </a>
                </li>
              </ul>
              
            </li>
            <!-- END NOTIFY TASK BAR -->
            
            <!-- START NOTIFY INBOX BAR -->
            
            <li id="header_inbox_bar" class="dropdown">
              <a data-toggle="dropdown" class="dropdown-toggle" href="#">
                <i class="fa fa-envelope-o">
                </i>
                <span class="badge bg-important">
                  5
                </span>
              </a>
              <ul class="dropdown-menu extended inbox">
                <li class="notify-arrow notify-arrow-blue">
                </li>
                <li>
                  <p class="blue">
                    You have 5 new messages
                  </p>
                </li>
                <li>
                  <a href="#">
                    <span class="photo">
                      <img alt="avatar" src="./img/avatar-mini.jpg">
                    </span>
                    <span class="subject">
                      <span class="from">
                        Chintan Pandya
                      </span>
                      <span class="time">
                        Just now
                      </span>
                    </span>
                    <span class="message">
                      Hello, this is an example msg.
                    </span>
                  </a>
                </li>
                <li>
                  <a href="#">
                    <span class="photo">
                      <img alt="avatar" src="./img/avatar-mini2.jpg">
                    </span>
                    <span class="subject">
                      <span class="from">
                        Parth Jani
                      </span>
                      <span class="time">
                        10 mins
                      </span>
                    </span>
                    <span class="message">
                      Hi, Bro how are you ?
                    </span>
                  </a>
                </li>
                <li>
                  <a href="#">
                    <span class="photo">
                      <img alt="avatar" src="./img/avatar-mini3.jpg">
                    </span>
                    <span class="subject">
                      <span class="from">
                        Jay Bardolia
                      </span>
                      <span class="time">
                        3 hrs
                      </span>
                    </span>
                    <span class="message">
                      This is awesome dashboard.
                    </span>
                  </a>
                </li>
                <li>
                  <a href="#">
                    <span class="photo">
                      <img alt="avatar" src="./img/avatar-mini4.jpg">
                    </span>
                    <span class="subject">
                      <span class="from">
                        Pruthvi Bardolia
                      </span>
                      <span class="time">
                        Just now
                      </span>
                    </span>
                    <span class="message">
                      Hello, this is metrolab
                    </span>
                  </a>
                </li>
                <li>
                  <a href="#">
                    See all messages
                  </a>
                </li>
              </ul>
            </li>
            <!-- END NOTIFY INBOX BAR -->
            
            <!-- START NOTIFY NOTIFICATION BAR -->
            
            <li id="header_notification_bar" class="dropdown">
              <a data-toggle="dropdown" class="dropdown-toggle" href="#">
                <i class="fa fa-bell-o">
                </i>
                <span class="badge bg-warning">
                  7
                </span>
              </a>
              <ul class="dropdown-menu extended notification">
                <li class="notify-arrow notify-arrow-blue">
                </li>
                <li>
                  <p class="blue">
                    You have 7 new notifications
                  </p>
                </li>
                <li>
                  <a href="#">
                    <span class="label label-danger">
                      <i class="fa fa-bolt">
                      </i>
                    </span>
                    Server #3 overloaded.
                    <span class="small italic">
                      34 mins
                    </span>
                  </a>
                </li>
                <li>
                  <a href="#">
                    <span class="label label-warning">
                      <i class="fa fa-bell">
                      </i>
                    </span>
                    Server #10 not respoding.
                    <span class="small italic">
                      1 Hours
                    </span>
                  </a>
                </li>
                <li>
                  <a href="#">
                    <span class="label label-danger">
                      <i class="fa fa-bolt">
                      </i>
                    </span>
                    Database overloaded 24%.
                    <span class="small italic">
                      4 hrs
                    </span>
                  </a>
                </li>
                <li>
                  <a href="#">
                    <span class="label label-success">
                      <i class="fa fa-plus">
                      </i>
                    </span>
                    New user registered.
                    <span class="small italic">
                      Just now
                    </span>
                  </a>
                </li>
                <li>
                  <a href="#">
                    <span class="label label-primary">
                      <i class="fa fa-bullhorn">
                      </i>
                    </span>
                    Application error.
                    <span class="small italic">
                      10 mins
                    </span>
                  </a>
                </li>
                <li>
                  <a href="#">
                    See all notifications
                  </a>
                </li>
              </ul>
            </li>
            <!-- END NOTIFY NOTIFICATION BAR -->
            
          </ul>
          
          
        </nav>
        
        <!-- END HEADER NAV -->
        
		 <!-- START USER LOGIN DROPDOWN  -->
          <div class="top-nav ">
            <ul class="nav pull-right top-menu">
              <li>
                <input type="text" class="form-control search" placeholder="Search">
              </li>
              <li class="dropdown">
                <a data-toggle="dropdown" class="dropdown-toggle" href="#">
                  <img alt="" src="img/avatar1_small.jpg">
                  <span class="username">
                    Pruthvi
                  </span>
                  <b class="caret">
                  </b>
                </a>
                <ul class="dropdown-menu extended logout">
                  <li class="log-arrow-up">
                  </li>
                  <li>
                    <a href="#">
                      <i class=" fa fa-suitcase">
                      </i>
                      Profile
                    </a>
                  </li>
                  <li>
                    <a href="#">
                      <i class="fa fa-cog">
                      </i>
                      Settings
                    </a>
                  </li>
                  <li>
                    <a href="#">
                      <i class="fa fa-bell-o">
                      </i>
                      Notification
                    </a>
                  </li>
                  <li>
                    <a href="login.html">
                      <i class="fa fa-key">
                      </i>
                      Log Out
                    </a>
                  </li>
                </ul>
              </li>
            </ul>
          </div>
		  <!-- END USER LOGIN DROPDOWN  -->
        </header>
        <!-- END HEADER -->
        <!-- BEGIN SIDEBAR -->
        <aside>
          <div id="sidebar" class="nav-collapse">
            <ul class="sidebar-menu" id="nav-accordion">
              <li>
                <a href="index.html">
                  <i class="fa fa-dashboard">
                  </i>
                  <span>
                    Dashboard
                  </span>
                </a>
              </li>
              <li class="sub-menu">
                <a href="javascript:;">
                  <i class="fa fa-laptop">
                  </i>
                  <span>
                    Layouts
                  </span>
                  <span class="label label-success span-sidebar">
                    4
                  </span>
                </a>
                <ul class="sub">
                  <li>
                    <a href="boxed_page.html">
                      Boxed Page
                    </a>
                  </li>
                  <li>
                    <a href="horizontal_menu.html">
                      Horizontal Menubar
                    </a>
                  </li>
                  <li>
                    <a href="language_switch_bar.html">
                      Language Bar
                    </a>
                  </li>
                  <li>
                    <a href="email_template.html" target="_blank">
                      Email Templates
                    </a>
                  </li>
                </ul>
              </li>
              <li class="sub-menu">
                <a href="javascript:;">
                  <i class="fa fa-book">
                  </i>
                  <span>
                    UI Elements
                  </span>
                  <span class="label label-info span-sidebar">
                    7
                  </span>
                </a>
                <ul class="sub">
                  <li>
                    <a href="general.html">
                      General
                    </a>
                  </li>
                  <li>
                    <a href="buttons.html">
                      Buttons
                    </a>
                  </li>
                  <li>
                    <a href="widget.html">
                      Widget
                    </a>
                  </li>
                  <li>
                    <a href="slider.html">
                      Range Slider
                    </a>
                  </li>
                  <li>
                    <a href="nestable.html">
                      Nestable List
                    </a>
                  </li>
                  <li>
                    <a href="tree.html">
                      Tree View List
                    </a>
                  </li>
                  <li>
                    <a href="font_awesome.html">
                      Font Awesome Icon
                    </a>
                  </li>
                </ul>
              </li>
              <li class="sub-menu">
                <a href="javascript:;">
                  <i class="fa fa-cogs">
                  </i>
                  <span>
                    Components
                  </span>
                  <span class="label label-primary span-sidebar">
                    5
                  </span>
                </a>
                <ul class="sub">
                  <li>
                    <a href="grids.html">
                      Grids
                    </a>
                  </li>
                  <li>
                    <a href="calendar.html">
                      Calendar
                    </a>
                  </li>
                  <li>
                    <a href="gallery.html">
                      Gallery
                    </a>
                  </li>
                  <li>
                    <a href="todo_list.html">
                      Todo List
                    </a>
                  </li>
                  <li>
                    <a href="draggable_portlet.html">
                      Draggable Portlets
                    </a>
                  </li>
                </ul>
              </li>
              <li class="sub-menu">
                <a href="javascript:;">
                  <i class="fa fa-tasks">
                  </i>
                  <span>
                    Form Stuff
                  </span>
                  <span class="label label-info span-sidebar">
                    7
                  </span>
                </a>
                <ul class="sub">
                  <li>
                    <a href="form_component.html">
                      Form Components
                    </a>
                  </li>
                  <li>
                    <a href="advanced_form_components.html">
                      Advanced Components
                    </a>
                  </li>
                  <li>
                    <a href="form_wizard.html">
                      Form Wizards
                    </a>
                  </li>
                  <li>
                    <a href="form_validation.html">
                      Form Validation
                    </a>
                  </li>
                  <li>
                    <a href="dropzone.html">
                      Dropzone File Upload
                    </a>
                  </li>
                  <li>
                    <a href="inline_editor.html">
                      Inline Editor
                    </a>
                  </li>
                  <li>
                    <a href="file_upload.html">
                      Multiple File Upload
                    </a>
                  </li>
                </ul>
              </li>
              <li class="sub-menu">
                <a href="javascript:;">
                  <i class="fa fa-th">
                  </i>
                  <span>
                    Data Tables
                  </span>
                  <span class="label label-inverse span-sidebar">
                    5
                  </span>
                </a>
                <ul class="sub">
                  <li>
                    <a href="basic_table.html">
                      Basic Table
                    </a>
                  </li>
                  <li>
                    <a href="responsive_table.html">
                      Responsive Table
                    </a>
                  </li>
                  <li>
                    <a href="dynamic_table.html">
                      Dynamic Table
                    </a>
                  </li>
                  <li>
                    <a href="advanced_table.html">
                      Advanced Table
                    </a>
                  </li>
                  <li>
                    <a href="editable_table.html">
                      Editable Table
                    </a>
                  </li>
                </ul>
              </li>
              <li class="sub-menu">
                <a href="javascript:;">
                  <i class=" fa fa-envelope">
                  </i>
                  <span>
                    Mail
                  </span>
                  <span class="label label-danger span-sidebar">
                    2
                  </span>
                </a>
                <ul class="sub">
                  <li>
                    <a href="inbox.html">
                      Inbox
                    </a>
                  </li>
                  <li>
                    <a href="inbox_details.html">
                      Mail Details
                    </a>
                  </li>
                </ul>
              </li>
              <li class="sub-menu">
                <a href="javascript:;">
                  <i class=" fa fa-bar-chart-o">
                  </i>
                  <span>
                    Charts
                  </span>
                  <span class="label label-warning span-sidebar">
                    4
                  </span>
                </a>
                <ul class="sub">
                  <li>
                    <a href="morris.html">
                      Morris Chart
                    </a>
                  </li>
                  <li>
                    <a href="chartjs.html">
                      Chartjs Chart
                    </a>
                  </li>
                  <li>
                    <a href="flot_chart.html">
                      Flot Charts
                    </a>
                  </li>
                  <li>
                    <a href="xchart.html">
                      xChart
                    </a>
                  </li>
                </ul>
              </li>
              <li class="sub-menu">
                <a href="javascript:;">
                  <i class="fa fa-shopping-cart">
                  </i>
                  <span>
                    Product
                  </span>
                  <span class="label label-success span-sidebar">
                    2
                  </span>
                </a>
                <ul class="sub">
                  <li>
                    <a href="product_list.html">
                      List View
                    </a>
                  </li>
                  <li>
                    <a href="product_details.html">
                      Details View
                    </a>
                  </li>
                </ul>
              </li>
              <li>
                <a href="google_maps.html">
                  <i class="fa fa-map-marker">
                  </i>
                  <span>
                    Google Maps 
                  </span>
                </a>
              </li>
              <li class="sub-menu">
                <a href="javascript:;" class="active">
                  <i class="fa fa-glass">
                  </i>
                  <span>
                    Extra Pages
                  </span>
                  <span class="label label-primary span-sidebar">
                    10
                  </span>
                </a>
                <ul class="sub">
                  <li>
                    <a href="blank.html">
                      Blank Page
                    </a>
                  </li>
                  <li>
                    <a href="lock_screen.html">
                      Lock Screen
                    </a>
                  </li>
                  <li>
                    <a href="profile.html">
                      Profile
                    </a>
                  </li>
                  <li>
                    <a href="invoice.html">
                      Invoice
                    </a>
                  </li>
                  <li class="active">
                    <a href="search_result.html">
                      Search Result
                    </a>
                  </li>
                  <li>
                    <a href="pricing_table.html">
                      Pricing Table
                    </a>
                  </li>
                  <li>
                    <a href="faq.html">
                      FAQ
                    </a>
                  </li>
                  <li>
                    <a href="fb_wall.html">
                      Timeline
                    </a>
                  </li>
                  <li>
                    <a href="404.html">
                      404 Error
                    </a>
                  </li>
                  <li>
                    <a href="500.html">
                      500 Error
                    </a>
                  </li>
                </ul>
              </li>
              <li>
                <a href="login.html">
                  <i class="fa fa-user">
                  </i>
                  <span>
                    Login Page
                  </span>
                </a>
              </li>
              <li class="sub-menu">
                <a href="javascript:;">
                  <i class="fa fa-sitemap">
                  </i>
                  <span>
                    Multi level Menu
                  </span>
                </a>
                <ul class="sub">
                  <li>
                    <a href="javascript:;">
                      Menu Item 1
                    </a>
                  </li>
                  <li class="sub-menu">
                    <a href="boxed_page.html">
                      Menu Item 2 
                      <span class="label label-primary">
                        1
                      </span>
                    </a>
                    <ul class="sub">
                      <li>
                        <a href="javascript:;">
                          Item 2.1
                        </a>
                      </li>
                      <li class="sub-menu">
                        <a href="javascript:;">
                          Menu Item 3 
                          <span class="label label-primary">
                            3
                          </span>
                        </a>
                        <ul class="sub">
                          <li>
                            <a href="javascript:;">
                              Item 3.1
                            </a>
                          </li>
                          <li>
                            <a href="javascript:;">
                              Item 3.2
                            </a>
                          </li>
                          <li>
                            <a href="javascript:;">
                              Item 3.2
                            </a>
                          </li>
                        </ul>
                      </li>
                    </ul>
                  </li>
                </ul>
              </li>
            </ul>
          </div>
        </aside>
        <!-- END SIDEBAR -->
        <!-- BEGIN MAIN CONTENT -->
        <section id="main-content">
		  <!-- BEGIN WRAPPER -->
          <section class="wrapper">
            <section class="panel">
              <header class="panel-heading">
                <span class="label label-primary">
                  Classic Search
                </span>
                <span class="tools pull-right">
                  <a href="javascript:;" class="fa fa-chevron-down">
                  </a>
                  <a href="javascript:;" class="fa fa-times">
                  </a>
                </span>
              </header>
              <div class="panel-body">
                <form class="form-horizontal search-result">
                  <div class="form-group">
                    <label class="col-lg-1 col-sm-1 control-label">
                      Search
                    </label>
                    <div class="col-lg-8 col-sm-8">
                      <input type="text" class="form-control input-xxlarge">
                      <p class="help-block">
                        About 5,880,000 results (0.23 seconds) 
                      </p>
                    </div>
                    <div class="col-lg-2">
                      <button class="btn " type="submit">
                        SEARCH
                      </button>
                    </div>
                  </div>
                </form>
                <div class="panel with-nav-tabs panel-info panel-square panel-no-border">
                  <div class="panel-heading">
                    <div class="right-content pull-right">
                      <div class="btn-group">
                        <button class="btn btn-info btn-sm btn-rounded-lg dropdown-toggle" data-toggle="dropdown">
                          <i class="fa fa-cog">
                          </i>
                        </button>
                        <ul class="dropdown-menu success pull-right square margin-list" role="menu">
                          <li>
                            <a href="#fakelink">
                              Action
                            </a>
                          </li>
                          <li>
                            <a href="#fakelink">
                              Another action
                            </a>
                          </li>
                          <li class="active">
                            <a href="#fakelink">
                              Active
                            </a>
                          </li>
                          <li class="divider">
                          </li>
                          <li>
                            <a href="#fakelink">
                              Separated link
                            </a>
                          </li>
                        </ul>
                      </div>
                    </div>
                    
                    <ul class="nav nav-tabs">
                      <li class="active">
                        <a href="#example-search-article" data-toggle="tab">
                          <i class="fa fa-edit">
                          </i>
                          Article
                        </a>
                      </li>
                      <li class="">
                        <a href="#example-search-images" data-toggle="tab">
                          <i class="fa fa-picture-o">
                          </i>
                          Images
                        </a>
                      </li>
                      <li class="">
                        <a href="#example-search-file" data-toggle="tab">
                          <i class="fa fa-cloud-download">
                          </i>
                          File
                        </a>
                      </li>
                      <li class="">
                        <a href="#example-search-user" data-toggle="tab">
                          <i class="fa fa-users">
                          </i>
                          User
                        </a>
                      </li>
                    </ul>
                  </div>
                  <div id="panel-collapse-1" class="collapse in">
                    <div class="panel-body">
                      <div class="alert alert-info fade in alert-dismissable">
                        <button type="button" class="close" data-dismiss="alert" aria-hidden="true">
                          ×
                        </button>
                        <strong>
                          1,411
                        </strong>
                        results for 
                        <i>
                          something keyword
                        </i>
                      </div>
                      <div class="tab-content">
                        <div class="tab-pane fade active in" id="example-search-article">
                          <div class="row">
                            <div class="col-sm-8 col-xs-12">
                              <ul class="media-list">
                                <li class="media">
                                  <div class="media-body">
                                    <h4 class="media-heading">
                                      <a href="#fakelink">
                                        Lorem 
                                        <strong>
                                          ipsum
                                        </strong>
                                        dolor sit amet, consectetuer adipiscing elit
                                      </a>
                                    </h4>
                                    <p class="text-info">
                                      http://themeforest.net/lorem-ipsum-dolor-sit...
                                    </p>
                                    <p>
                                      <i class="fa fa-star text-warning">
                                      </i>
                                      
                                      <i class="fa fa-star text-warning">
                                      </i>
                                      
                                      <i class="fa fa-star text-warning">
                                      </i>
                                      
                                      <i class="fa fa-star text-warning">
                                      </i>
                                      
                                      <i class="fa fa-star">
                                      </i>
                                      |
                                      based on 1,254 review
                                    </p>
                                    <p>
                                      <span class="text-muted">
                                        April 20, 2014
                                      </span>
                                      - 
                                      Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat.
                                    </p>
                                  </div>
                                </li>
                                <li class="media">
                                  <div class="media-body">
                                    <h4 class="media-heading">
                                      <a href="#fakelink">
                                        Lorem 
                                        <strong>
                                          ipsum
                                        </strong>
                                        dolor sit amet, consectetuer adipiscing elit
                                      </a>
                                    </h4>
                                    <p class="text-info">
                                      http://themeforest.net/lorem-ipsum-dolor-sit...
                                    </p>
                                    <p>
                                      <i class="fa fa-star text-warning">
                                      </i>
                                      
                                      <i class="fa fa-star text-warning">
                                      </i>
                                      
                                      <i class="fa fa-star">
                                      </i>
                                      
                                      <i class="fa fa-star">
                                      </i>
                                      
                                      <i class="fa fa-star">
                                      </i>
                                      |
                                      based on 214 review
                                    </p>
                                    <p>
                                      <span class="text-muted">
                                        April 20, 2014
                                      </span>
                                      - 
                                      Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat.
                                    </p>
                                  </div>
                                </li>
                                <li class="media">
                                  <div class="media-body">
                                    <h4 class="media-heading">
                                      <a href="#fakelink">
                                        Lorem 
                                        <strong>
                                          ipsum
                                        </strong>
                                        dolor sit amet, consectetuer adipiscing elit
                                      </a>
                                    </h4>
                                    <p class="text-info">
                                      http://themeforest.net/lorem-ipsum-dolor-sit...
                                    </p>
                                    <p>
                                      <i class="fa fa-star text-warning">
                                      </i>
                                      
                                      <i class="fa fa-star text-warning">
                                      </i>
                                      
                                      <i class="fa fa-star text-warning">
                                      </i>
                                      
                                      <i class="fa fa-star text-warning">
                                      </i>
                                      
                                      <i class="fa fa-star">
                                      </i>
                                      |
                                      based on 1,010 review
                                    </p>
                                    <p>
                                      <span class="text-muted">
                                        April 20, 2014
                                      </span>
                                      - 
                                      Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat.
                                    </p>
                                  </div>
                                </li>
                                <li class="media">
                                  <div class="media-body">
                                    <h4 class="media-heading">
                                      <a href="#fakelink">
                                        Lorem 
                                        <strong>
                                          ipsum
                                        </strong>
                                        dolor sit amet, consectetuer adipiscing elit
                                      </a>
                                    </h4>
                                    <p class="text-info">
                                      http://themeforest.net/lorem-ipsum-dolor-sit...
                                    </p>
                                    <p>
                                      <i class="fa fa-star text-warning">
                                      </i>
                                      
                                      <i class="fa fa-star text-warning">
                                      </i>
                                      
                                      <i class="fa fa-star text-warning">
                                      </i>
                                      
                                      <i class="fa fa-star text-warning">
                                      </i>
                                      
                                      <i class="fa fa-star text-warning">
                                      </i>
                                      |
                                      based on 2,254 review
                                    </p>
                                    <p>
                                      <span class="text-muted">
                                        April 20, 2014
                                      </span>
                                      - 
                                      Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat.
                                    </p>
                                  </div>
                                </li>
                                <li class="media">
                                  <div class="media-body">
                                    <h4 class="media-heading">
                                      <a href="#fakelink">
                                        Lorem 
                                        <strong>
                                          ipsum
                                        </strong>
                                        dolor sit amet, consectetuer adipiscing elit
                                      </a>
                                    </h4>
                                    <p class="text-info">
                                      http://themeforest.net/lorem-ipsum-dolor-sit...
                                    </p>
                                    <p>
                                      <i class="fa fa-star text-warning">
                                      </i>
                                      
                                      <i class="fa fa-star text-warning">
                                      </i>
                                      
                                      <i class="fa fa-star text-warning">
                                      </i>
                                      
                                      <i class="fa fa-star">
                                      </i>
                                      
                                      <i class="fa fa-star">
                                      </i>
                                      |
                                      based on 1,000 review
                                    </p>
                                    <p>
                                      <span class="text-muted">
                                        April 20, 2014
                                      </span>
                                      - 
                                      Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat.
                                    </p>
                                  </div>
                                </li>
                              </ul>
                              <hr>
                              
                              <ul class="pagination success">
                                <li class="disabled">
                                  <a href="#fakelink">
                                    «
                                  </a>
                                </li>
                                <li class="disabled">
                                  <a href="#fakelink">
                                    ‹
                                  </a>
                                </li>
                                <li class="active">
                                  <a href="#fakelink">
                                    1
                                  </a>
                                </li>
                                <li>
                                  <a href="#fakelink">
                                    2
                                  </a>
                                </li>
                                <li>
                                  <a href="#fakelink">
                                    ...
                                  </a>
                                </li>
                                <li>
                                  <a href="#fakelink">
                                    20
                                  </a>
                                </li>
                                <li>
                                  <a href="#fakelink">
                                    ›
                                  </a>
                                </li>
                                <li>
                                  <a href="#fakelink">
                                    »
                                  </a>
                                </li>
                              </ul>
                            </div>
                            
                          </div>
                          <!-- /.row -->
                        </div>
                        <div class="tab-pane fade" id="example-search-images">
                          <ul class="media-list">
                            <li class="media">
                              <a href="#fakelink" class="pull-left">
                                <img src="img/search-img.jpg" class="media-object image-thumb-result" alt="Avatar">
                              </a>
                              <div class="media-body">
                                <h4 class="media-heading">
                                  <a href="#fakelink">
                                    Lorem 
                                    <strong>
                                      ipsum
                                    </strong>
                                    photo
                                  </a>
                                </h4>
                                <p class="text-info">
                                  http://themeforest.net/lorem-ipsum-dolor-sit...
                                </p>
                                <p>
                                  <strong class="text-info">
                                    234 Kb
                                  </strong>
                                  | 
                                  <span class="text-info">
                                    JPEG
                                  </span>
                                  |  April 20, 2014 
                                </p>
                              </div>
                            </li>
                            <li class="media">
                              <a href="#fakelink" class="pull-left">
                                <img src="img/search-img.jpg" class="media-object image-thumb-result" alt="Avatar">
                              </a>
                              <div class="media-body">
                                <h4 class="media-heading">
                                  <a href="#fakelink">
                                    Lorem 
                                    <strong>
                                      ipsum
                                    </strong>
                                    photo
                                  </a>
                                </h4>
                                <p class="text-info">
                                  http://themeforest.net/lorem-ipsum-dolor-sit...
                                </p>
                                <p>
                                  <strong class="text-info">
                                    234 Kb
                                  </strong>
                                  | 
                                  <span class="text-info">
                                    JPEG
                                  </span>
                                  |  April 20, 2014 
                                </p>
                              </div>
                            </li>
                            <li class="media">
                              <a href="#fakelink" class="pull-left">
                                <img src="img/search-img.jpg" class="media-object image-thumb-result" alt="Avatar">
                              </a>
                              <div class="media-body">
                                <h4 class="media-heading">
                                  <a href="#fakelink">
                                    Lorem 
                                    <strong>
                                      ipsum
                                    </strong>
                                    photo
                                  </a>
                                </h4>
                                <p class="text-info">
                                  http://themeforest.net/lorem-ipsum-dolor-sit...
                                </p>
                                <p>
                                  <strong class="text-info">
                                    234 Kb
                                  </strong>
                                  | 
                                  <span class="text-info">
                                    JPEG
                                  </span>
                                  |  April 20, 2014 
                                </p>
                              </div>
                            </li>
                            <li class="media">
                              <a href="#fakelink" class="pull-left">
                                <img src="img/search-img.jpg" class="media-object image-thumb-result" alt="Avatar">
                              </a>
                              <div class="media-body">
                                <h4 class="media-heading">
                                  <a href="#fakelink">
                                    Lorem 
                                    <strong>
                                      ipsum
                                    </strong>
                                    photo
                                  </a>
                                </h4>
                                <p class="text-info">
                                  http://themeforest.net/lorem-ipsum-dolor-sit...
                                </p>
                                <p>
                                  <strong class="text-info">
                                    234 Kb
                                  </strong>
                                  | 
                                  <span class="text-info">
                                    JPEG
                                  </span>
                                  |  April 20, 2014 
                                </p>
                              </div>
                            </li>
                            <li class="media">
                              <a href="#fakelink" class="pull-left">
                                <img src="img/search-img.jpg" class="media-object image-thumb-result" alt="Avatar">
                              </a>
                              <div class="media-body">
                                <h4 class="media-heading">
                                  <a href="#fakelink">
                                    Lorem 
                                    <strong>
                                      ipsum
                                    </strong>
                                    photo
                                  </a>
                                </h4>
                                <p class="text-info">
                                  http://themeforest.net/lorem-ipsum-dolor-sit...
                                </p>
                                <p>
                                  <strong class="text-info">
                                    234 Kb
                                  </strong>
                                  | 
                                  <span class="text-info">
                                    JPEG
                                  </span>
                                  |  April 20, 2014 
                                </p>
                              </div>
                            </li>
                            <li class="media">
                              <a href="#fakelink" class="pull-left">
                                <img src="img/search-img.jpg" class="media-object image-thumb-result" alt="Avatar">
                              </a>
                              <div class="media-body">
                                <h4 class="media-heading">
                                  <a href="#fakelink">
                                    Lorem 
                                    <strong>
                                      ipsum
                                    </strong>
                                    photo
                                  </a>
                                </h4>
                                <p class="text-info">
                                  http://themeforest.net/lorem-ipsum-dolor-sit...
                                </p>
                                <p>
                                  <strong class="text-info">
                                    234 Kb
                                  </strong>
                                  | 
                                  <span class="text-info">
                                    JPEG
                                  </span>
                                  |  April 20, 2014 
                                </p>
                              </div>
                            </li>
                            <li class="media">
                              <a href="#fakelink" class="pull-left">
                                <img src="img/search-img.jpg" class="media-object image-thumb-result" alt="Avatar">
                              </a>
                              <div class="media-body">
                                <h4 class="media-heading">
                                  <a href="#fakelink">
                                    Lorem 
                                    <strong>
                                      ipsum
                                    </strong>
                                    photo
                                  </a>
                                </h4>
                                <p class="text-info">
                                  http://themeforest.net/lorem-ipsum-dolor-sit...
                                </p>
                                <p>
                                  <strong class="text-info">
                                    234 Kb
                                  </strong>
                                  | 
                                  <span class="text-info">
                                    JPEG
                                  </span>
                                  |  April 20, 2014 
                                </p>
                              </div>
                            </li>
                            <li class="media">
                              <a href="#fakelink" class="pull-left">
                                <img src="img/search-img.jpg" class="media-object image-thumb-result" alt="Avatar">
                              </a>
                              <div class="media-body">
                                <h4 class="media-heading">
                                  <a href="#fakelink">
                                    Lorem 
                                    <strong>
                                      ipsum
                                    </strong>
                                    photo
                                  </a>
                                </h4>
                                <p class="text-info">
                                  http://themeforest.net/lorem-ipsum-dolor-sit...
                                </p>
                                <p>
                                  <strong class="text-info">
                                    234 Kb
                                  </strong>
                                  | 
                                  <span class="text-info">
                                    JPEG
                                  </span>
                                  |  April 20, 2014 
                                </p>
                              </div>
                            </li>
                            <li class="media">
                              <a href="#fakelink" class="pull-left">
                                <img src="img/search-img.jpg" class="media-object image-thumb-result" alt="Avatar">
                              </a>
                              <div class="media-body">
                                <h4 class="media-heading">
                                  <a href="#fakelink">
                                    Lorem 
                                    <strong>
                                      ipsum
                                    </strong>
                                    photo
                                  </a>
                                </h4>
                                <p class="text-info">
                                  http://themeforest.net/lorem-ipsum-dolor-sit...
                                </p>
                                <p>
                                  <strong class="text-info">
                                    234 Kb
                                  </strong>
                                  | 
                                  <span class="text-info">
                                    JPEG
                                  </span>
                                  |  April 20, 2014 
                                </p>
                              </div>
                            </li>
                            <li class="media">
                              <a href="#fakelink" class="pull-left">
                                <img src="img/search-img.jpg" class="media-object image-thumb-result" alt="Avatar">
                              </a>
                              <div class="media-body">
                                <h4 class="media-heading">
                                  <a href="#fakelink">
                                    Lorem 
                                    <strong>
                                      ipsum
                                    </strong>
                                    photo
                                  </a>
                                </h4>
                                <p class="text-info">
                                  http://themeforest.net/lorem-ipsum-dolor-sit...
                                </p>
                                <p>
                                  <strong class="text-info">
                                    234 Kb
                                  </strong>
                                  | 
                                  <span class="text-info">
                                    JPEG
                                  </span>
                                  |  April 20, 2014 
                                </p>
                              </div>
                            </li>
                          </ul>
                          <hr>
                          <!-- Pagination success -->
                          <ul class="pagination success">
                            <li class="disabled">
                              <a href="#fakelink">
                                «
                              </a>
                            </li>
                            <li class="disabled">
                              <a href="#fakelink">
                                ‹
                              </a>
                            </li>
                            <li class="active">
                              <a href="#fakelink">
                                1
                              </a>
                            </li>
                            <li>
                              <a href="#fakelink">
                                2
                              </a>
                            </li>
                            <li>
                              <a href="#fakelink">
                                ...
                              </a>
                            </li>
                            <li>
                              <a href="#fakelink">
                                20
                              </a>
                            </li>
                            <li>
                              <a href="#fakelink">
                                ›
                              </a>
                            </li>
                            <li>
                              <a href="#fakelink">
                                »
                              </a>
                            </li>
                          </ul>
                        </div>
                        <div class="tab-pane fade" id="example-search-file">
                          <ul class="media-list media-sm media-dotted">
                            <li class="media">
                              <a class="pull-left" href="#fakelink">
                                <i class="fa fa-music icon-sm icon-rounded icon-success">
                                </i>
                              </a>
                              <div class="media-body">
                                <div class="row">
                                  <div class="col-sm-4">
                                    <h4 class="media-heading">
                                      <a href="#fakelink">
                                        Jogja Istimewa.mp3
                                      </a>
                                    </h4>
                                    <p>
                                      <small class="text-info">
                                        3,214 Kb
                                      </small>
                                      | 
                                      <small>
                                        20 April 2014
                                      </small>
                                    </p>
                                  </div>
                                  <!-- /.com-sm-6 -->
                                  <div class="col-sm-4">
                                    <button class="btn btn-info btn-sm">
                                      <i class="fa fa-cloud-download">
                                      </i>
                                      Download
                                    </button>
                                    <button class="btn btn-warning btn-sm">
                                      <i class="fa fa-volume-up">
                                      </i>
                                      Listen
                                    </button>
                                  </div>
                                </div>
                                <!-- /.row -->
                              </div>
                            </li>
                            <li class="media">
                              <a class="pull-left" href="#fakelink">
                                <i class="fa fa-code icon-sm icon-rounded icon-danger">
                                </i>
                              </a>
                              <div class="media-body">
                                <div class="row">
                                  <div class="col-sm-4">
                                    <h4 class="media-heading">
                                      <a href="#fakelink">
                                        Sentir-index.html
                                      </a>
                                    </h4>
                                    <p>
                                      <small class="text-info">
                                        5 Kb
                                      </small>
                                      | 
                                      <small>
                                        20 April 2014
                                      </small>
                                    </p>
                                  </div>
                                  <!-- /.com-sm-6 -->
                                  <div class="col-sm-4">
                                    <button class="btn btn-info btn-sm">
                                      <i class="fa fa-cloud-download">
                                      </i>
                                      Download
                                    </button>
                                  </div>
                                </div>
                                <!-- /.row -->
                              </div>
                            </li>
                            <li class="media">
                              <a class="pull-left" href="#fakelink">
                                <i class="fa fa-play-circle icon-sm icon-rounded icon-success">
                                </i>
                              </a>
                              <div class="media-body">
                                <div class="row">
                                  <div class="col-sm-4">
                                    <h4 class="media-heading">
                                      <a href="#fakelink">
                                        Sera live in concert.avi
                                      </a>
                                    </h4>
                                    <p>
                                      <small class="text-info">
                                        50,214 Kb
                                      </small>
                                      | 
                                      <small>
                                        20 April 2014
                                      </small>
                                    </p>
                                  </div>
                                  <!-- /.com-sm-6 -->
                                  <div class="col-sm-4">
                                    <button class="btn btn-info btn-sm">
                                      <i class="fa fa-cloud-download">
                                      </i>
                                      Download
                                    </button>
                                    <button class="btn btn-warning btn-sm">
                                      <i class="fa fa-video-camera">
                                      </i>
                                      Watch
                                    </button>
                                  </div>
                                </div>
                                <!-- /.row -->
                              </div>
                            </li>
                            <li class="media">
                              <a class="pull-left" href="#fakelink">
                                <i class="fa fa-copy icon-sm icon-rounded icon-info">
                                </i>
                              </a>
                              <div class="media-body">
                                <div class="row">
                                  <div class="col-sm-4">
                                    <h4 class="media-heading">
                                      <a href="#fakelink">
                                        Tesis ku.docx
                                      </a>
                                    </h4>
                                    <p>
                                      <small class="text-info">
                                        10,214 Kb
                                      </small>
                                      | 
                                      <small>
                                        20 April 2014
                                      </small>
                                    </p>
                                  </div>
                                  <!-- /.com-sm-6 -->
                                  <div class="col-sm-4">
                                    <button class="btn btn-info btn-sm">
                                      <i class="fa fa-cloud-download">
                                      </i>
                                      Download
                                    </button>
                                  </div>
                                </div>
                                <!-- /.row -->
                              </div>
                            </li>
                            <li class="media">
                              <a class="pull-left" href="#fakelink">
                                <i class="fa fa-copy icon-sm icon-rounded icon-info">
                                </i>
                              </a>
                              <div class="media-body">
                                <div class="row">
                                  <div class="col-sm-4">
                                    <h4 class="media-heading">
                                      <a href="#fakelink">
                                        Revisi bab 3.docx
                                      </a>
                                    </h4>
                                    <p>
                                      <small class="text-info">
                                        2,214 Kb
                                      </small>
                                      | 
                                      <small>
                                        20 April 2014
                                      </small>
                                    </p>
                                  </div>
                                  <!-- /.com-sm-6 -->
                                  <div class="col-sm-4">
                                    <button class="btn btn-info btn-sm">
                                      <i class="fa fa-cloud-download">
                                      </i>
                                      Download
                                    </button>
                                  </div>
                                </div>
                                <!-- /.row -->
                              </div>
                            </li>
                            <li class="media">
                              <a class="pull-left" href="#fakelink">
                                <i class="fa fa-music icon-sm icon-rounded icon-warning">
                                </i>
                              </a>
                              <div class="media-body">
                                <div class="row">
                                  <div class="col-sm-4">
                                    <h4 class="media-heading">
                                      <a href="#fakelink">
                                        Ringtone hanpon.wav
                                      </a>
                                    </h4>
                                    <p>
                                      <small class="text-info">
                                        1,214 Kb
                                      </small>
                                      | 
                                      <small>
                                        20 April 2014
                                      </small>
                                    </p>
                                  </div>
                                  <!-- /.com-sm-6 -->
                                  <div class="col-sm-4">
                                    <button class="btn btn-info btn-sm">
                                      <i class="fa fa-cloud-download">
                                      </i>
                                      Download
                                    </button>
                                    <button class="btn btn-warning btn-sm">
                                      <i class="fa fa-volume-up">
                                      </i>
                                      Listen
                                    </button>
                                  </div>
                                </div>
                                <!-- /.row -->
                              </div>
                            </li>
                            <li class="media">
                              <a class="pull-left" href="#fakelink">
                                <i class="fa fa-music icon-sm icon-rounded icon-success">
                                </i>
                              </a>
                              <div class="media-body">
                                <div class="row">
                                  <div class="col-sm-4">
                                    <h4 class="media-heading">
                                      <a href="#fakelink">
                                        Karmila.mp3
                                      </a>
                                    </h4>
                                    <p>
                                      <small class="text-info">
                                        3,214 Kb
                                      </small>
                                      | 
                                      <small>
                                        20 April 2014
                                      </small>
                                    </p>
                                  </div>
                                  <!-- /.com-sm-6 -->
                                  <div class="col-sm-4">
                                    <button class="btn btn-info btn-sm">
                                      <i class="fa fa-cloud-download">
                                      </i>
                                      Download
                                    </button>
                                    <button class="btn btn-warning btn-sm">
                                      <i class="fa fa-volume-up">
                                      </i>
                                      Listen
                                    </button>
                                  </div>
                                </div>
                                <!-- /.row -->
                              </div>
                            </li>
                            <li class="media">
                              <a class="pull-left" href="#fakelink">
                                <i class="fa fa-copy icon-sm icon-rounded icon-info">
                                </i>
                              </a>
                              <div class="media-body">
                                <div class="row">
                                  <div class="col-sm-4">
                                    <h4 class="media-heading">
                                      <a href="#fakelink">
                                        Pengeluaran bulan April.xlsx
                                      </a>
                                    </h4>
                                    <p>
                                      <small class="text-info">
                                        214 Kb
                                      </small>
                                      | 
                                      <small>
                                        20 April 2014
                                      </small>
                                    </p>
                                  </div>
                                  <!-- /.com-sm-6 -->
                                  <div class="col-sm-4">
                                    <button class="btn btn-info btn-sm">
                                      <i class="fa fa-cloud-download">
                                      </i>
                                      Download
                                    </button>
                                  </div>
                                </div>
                                <!-- /.row -->
                              </div>
                            </li>
                            <li class="media">
                              <a class="pull-left" href="#fakelink">
                                <i class="fa fa-play-circle icon-sm icon-rounded icon-success">
                                </i>
                              </a>
                              <div class="media-body">
                                <div class="row">
                                  <div class="col-sm-4">
                                    <h4 class="media-heading">
                                      <a href="#fakelink">
                                        Tears dont fall - Bullet for my valentine.avi
                                      </a>
                                    </h4>
                                    <p>
                                      <small class="text-info">
                                        25,214 Kb
                                      </small>
                                      | 
                                      <small>
                                        20 April 2014
                                      </small>
                                    </p>
                                  </div>
                                  <!-- /.com-sm-6 -->
                                  <div class="col-sm-4">
                                    <button class="btn btn-info btn-sm">
                                      <i class="fa fa-cloud-download">
                                      </i>
                                      Download
                                    </button>
                                    <button class="btn btn-warning btn-sm">
                                      <i class="fa fa-video-camera">
                                      </i>
                                      Watch
                                    </button>
                                  </div>
                                </div>
                                <!-- /.row -->
                              </div>
                            </li>
                            <li class="media">
                              <a class="pull-left" href="#fakelink">
                                <i class="fa fa-code icon-sm icon-rounded icon-danger">
                                </i>
                              </a>
                              <div class="media-body">
                                <div class="row">
                                  <div class="col-sm-4">
                                    <h4 class="media-heading">
                                      <a href="#fakelink">
                                        bootstrap.min.css
                                      </a>
                                    </h4>
                                    <p>
                                      <small class="text-info">
                                        53 Kb
                                      </small>
                                      | 
                                      <small>
                                        20 April 2014
                                      </small>
                                    </p>
                                  </div>
                                  <!-- /.com-sm-6 -->
                                  <div class="col-sm-4">
                                    <button class="btn btn-info btn-sm">
                                      <i class="fa fa-cloud-download">
                                      </i>
                                      Download
                                    </button>
                                  </div>
                                </div>
                                <!-- /.row -->
                              </div>
                            </li>
                          </ul>
                          <hr>
                          <!-- Pagination success -->
                          <ul class="pagination success">
                            <li class="disabled">
                              <a href="#fakelink">
                                «
                              </a>
                            </li>
                            <li class="disabled">
                              <a href="#fakelink">
                                ‹
                              </a>
                            </li>
                            <li class="active">
                              <a href="#fakelink">
                                1
                              </a>
                            </li>
                            <li>
                              <a href="#fakelink">
                                2
                              </a>
                            </li>
                            <li>
                              <a href="#fakelink">
                                ...
                              </a>
                            </li>
                            <li>
                              <a href="#fakelink">
                                20
                              </a>
                            </li>
                            <li>
                              <a href="#fakelink">
                                ›
                              </a>
                            </li>
                            <li>
                              <a href="#fakelink">
                                »
                              </a>
                            </li>
                          </ul>
                        </div>
                        <div class="tab-pane fade " id="example-search-user">
                          <ul class="media-list media-sm media-dotted">
                            <li class="media">
                              <a class="pull-left" href="#fakelink">
                                <img class="media-object img-square" src="img/avatar/avatar-4.jpg" alt="Avatar">
                              </a>
                              <div class="media-body">
                                <div class="row">
                                  <div class="col-sm-4">
                                    <h4 class="media-heading">
                                      <a href="#fakelink">
                                        Paris Hawker
                                      </a>
                                    </h4>
                                    <p>
                                      <i class="fa fa-map-marker">
                                      </i>
                                      Yogyakarta, Indonesia
                                      <br>
                                      <small class="text-info">
                                        25 murtual friends
                                      </small>
                                    </p>
                                  </div>
                                  <!-- /.com-sm-6 -->
                                  <div class="col-sm-4">
                                    <button class="btn btn-success btn-sm">
                                      <i class="fa fa-user">
                                      </i>
                                      Add friend
                                    </button>
                                    <button class="btn btn-info btn-sm">
                                      <i class="fa fa-envelope">
                                      </i>
                                      Message
                                    </button>
                                  </div>
                                </div>
                                <!-- /.row -->
                              </div>
                            </li>
                            <li class="media">
                              <a class="pull-left" href="#fakelink">
                                <img class="media-object img-square" src="img/avatar/avatar-1.jpg" alt="Avatar">
                              </a>
                              <div class="media-body">
                                <div class="row">
                                  <div class="col-sm-4">
                                    <h4 class="media-heading">
                                      <a href="#fakelink">
                                        Thomas White
                                      </a>
                                    </h4>
                                    <p>
                                      <i class="fa fa-map-marker">
                                      </i>
                                      Bandung, Indonesia
                                      <br>
                                      <small class="text-info">
                                        2 murtual friends
                                      </small>
                                    </p>
                                  </div>
                                  <!-- /.com-sm-6 -->
                                  <div class="col-sm-4">
                                    <button class="btn btn-success btn-sm">
                                      <i class="fa fa-user">
                                      </i>
                                      Add friend
                                    </button>
                                    <button class="btn btn-info btn-sm">
                                      <i class="fa fa-envelope">
                                      </i>
                                      Message
                                    </button>
                                  </div>
                                </div>
                                <!-- /.row -->
                              </div>
                            </li>
                            <li class="media">
                              <a class="pull-left" href="#fakelink">
                                <img class="media-object img-square" src="img/avatar/avatar-2.jpg" alt="Avatar">
                              </a>
                              <div class="media-body">
                                <div class="row">
                                  <div class="col-sm-4">
                                    <h4 class="media-heading">
                                      <a href="#fakelink">
                                        Doina Slaivici
                                      </a>
                                    </h4>
                                    <p>
                                      <i class="fa fa-map-marker">
                                      </i>
                                      London, United Kingdom
                                      <br>
                                      <small class="text-info">
                                        1 murtual friend
                                      </small>
                                    </p>
                                  </div>
                                  <!-- /.com-sm-6 -->
                                  <div class="col-sm-4">
                                    <button class="btn btn-success btn-sm">
                                      <i class="fa fa-user">
                                      </i>
                                      Add friend
                                    </button>
                                    <button class="btn btn-info btn-sm">
                                      <i class="fa fa-envelope">
                                      </i>
                                      Message
                                    </button>
                                  </div>
                                </div>
                                <!-- /.row -->
                              </div>
                            </li>
                            <li class="media">
                              <a class="pull-left" href="#fakelink">
                                <img class="media-object img-square" src="img/avatar/avatar-3.jpg" alt="Avatar">
                              </a>
                              <div class="media-body">
                                <div class="row">
                                  <div class="col-sm-4">
                                    <h4 class="media-heading">
                                      <a href="#fakelink">
                                        Harry Nichols
                                      </a>
                                    </h4>
                                    <p>
                                      <i class="fa fa-map-marker">
                                      </i>
                                      Sydney, Australia
                                      <br>
                                      <small class="text-info">
                                        15 murtual friends
                                      </small>
                                    </p>
                                  </div>
                                  <!-- /.com-sm-6 -->
                                  <div class="col-sm-4">
                                    <button class="btn btn-success btn-sm">
                                      <i class="fa fa-user">
                                      </i>
                                      Add friend
                                    </button>
                                    <button class="btn btn-info btn-sm">
                                      <i class="fa fa-envelope">
                                      </i>
                                      Message
                                    </button>
                                  </div>
                                </div>
                                <!-- /.row -->
                              </div>
                            </li>
                            <li class="media">
                              <a class="pull-left" href="#fakelink">
                                <img class="media-object img-square" src="img/avatar/avatar-4.jpg" alt="Avatar">
                              </a>
                              <div class="media-body">
                                <div class="row">
                                  <div class="col-sm-4">
                                    <h4 class="media-heading">
                                      <a href="#fakelink">
                                        Mihaela Cihac
                                      </a>
                                    </h4>
                                    <p>
                                      <i class="fa fa-map-marker">
                                      </i>
                                      Tokyo, Japan
                                      <br>
                                      <small class="text-info">
                                        0 murtual friends
                                      </small>
                                    </p>
                                  </div>
                                  <!-- /.com-sm-6 -->
                                  <div class="col-sm-4">
                                    <button class="btn btn-success btn-sm">
                                      <i class="fa fa-user">
                                      </i>
                                      Add friend
                                    </button>
                                    <button class="btn btn-info btn-sm">
                                      <i class="fa fa-envelope">
                                      </i>
                                      Message
                                    </button>
                                  </div>
                                </div>
                                <!-- /.row -->
                              </div>
                            </li>
                            <li class="media">
                              <a class="pull-left" href="#fakelink">
                                <img class="media-object img-square" src="img/avatar/avatar-3.jpg" alt="Avatar">
                              </a>
                              <div class="media-body">
                                <div class="row">
                                  <div class="col-sm-4">
                                    <h4 class="media-heading">
                                      <a href="#fakelink">
                                        Harold Chavez
                                      </a>
                                    </h4>
                                    <p>
                                      <i class="fa fa-map-marker">
                                      </i>
                                      Boyolali, Indonesia
                                      <br>
                                      <small class="text-info">
                                        7 murtual friends
                                      </small>
                                    </p>
                                  </div>
                                  <!-- /.com-sm-6 -->
                                  <div class="col-sm-4">
                                    <button class="btn btn-success btn-sm">
                                      <i class="fa fa-user">
                                      </i>
                                      Add friend
                                    </button>
                                    <button class="btn btn-info btn-sm">
                                      <i class="fa fa-envelope">
                                      </i>
                                      Message
                                    </button>
                                  </div>
                                </div>
                                <!-- /.row -->
                              </div>
                            </li>
                            <li class="media">
                              <a class="pull-left" href="#fakelink">
                                <img class="media-object img-square" src="img/avatar/avatar-2.jpg" alt="Avatar">
                              </a>
                              <div class="media-body">
                                <div class="row">
                                  <div class="col-sm-4">
                                    <h4 class="media-heading">
                                      <a href="#fakelink">
                                        Elizabeth Owens
                                      </a>
                                    </h4>
                                    <p>
                                      <i class="fa fa-map-marker">
                                      </i>
                                      News York, US
                                      <br>
                                      <small class="text-info">
                                        250 murtual friends
                                      </small>
                                    </p>
                                  </div>
                                  <!-- /.com-sm-6 -->
                                  <div class="col-sm-4">
                                    <button class="btn btn-success btn-sm">
                                      <i class="fa fa-user">
                                      </i>
                                      Add friend
                                    </button>
                                    <button class="btn btn-info btn-sm">
                                      <i class="fa fa-envelope">
                                      </i>
                                      Message
                                    </button>
                                  </div>
                                </div>
                                <!-- /.row -->
                              </div>
                            </li>
                            <li class="media">
                              <a class="pull-left" href="#fakelink">
                                <img class="media-object img-square" src="img/avatar/avatar-2.jpg" alt="Avatar">
                              </a>
                              <div class="media-body">
                                <div class="row">
                                  <div class="col-sm-4">
                                    <h4 class="media-heading">
                                      <a href="#fakelink">
                                        Frank Oliver
                                      </a>
                                    </h4>
                                    <p>
                                      <i class="fa fa-map-marker">
                                      </i>
                                      Surakarta, Indonesia
                                      <br>
                                      <small class="text-info">
                                        111 murtual friends
                                      </small>
                                    </p>
                                  </div>
                                  <!-- /.com-sm-6 -->
                                  <div class="col-sm-4">
                                    <button class="btn btn-success btn-sm">
                                      <i class="fa fa-user">
                                      </i>
                                      Add friend
                                    </button>
                                    <button class="btn btn-info btn-sm">
                                      <i class="fa fa-envelope">
                                      </i>
                                      Message
                                    </button>
                                  </div>
                                </div>
                                <!-- /.row -->
                              </div>
                            </li>
                            <li class="media">
                              <a class="pull-left" href="#fakelink">
                                <img class="media-object img-square" src="img/avatar/avatar-3.jpg" alt="Avatar">
                              </a>
                              <div class="media-body">
                                <div class="row">
                                  <div class="col-sm-4">
                                    <h4 class="media-heading">
                                      <a href="#fakelink">
                                        Mya Weastell
                                      </a>
                                    </h4>
                                    <p>
                                      <i class="fa fa-map-marker">
                                      </i>
                                      Melbourne, Australia
                                      <br>
                                      <small class="text-info">
                                        4 murtual friends
                                      </small>
                                    </p>
                                  </div>
                                  <!-- /.com-sm-6 -->
                                  <div class="col-sm-4">
                                    <button class="btn btn-success btn-sm">
                                      <i class="fa fa-user">
                                      </i>
                                      Add friend
                                    </button>
                                    <button class="btn btn-info btn-sm">
                                      <i class="fa fa-envelope">
                                      </i>
                                      Message
                                    </button>
                                  </div>
                                </div>
                                <!-- /.row -->
                              </div>
                            </li>
                            <li class="media">
                              <a class="pull-left" href="#fakelink">
                                <img class="media-object img-square" src="img/avatar/avatar-4.jpg" alt="Avatar">
                              </a>
                              <div class="media-body">
                                <div class="row">
                                  <div class="col-sm-4">
                                    <h4 class="media-heading">
                                      <a href="#fakelink">
                                        Carl Rodriguez
                                      </a>
                                    </h4>
                                    <p>
                                      <i class="fa fa-map-marker">
                                      </i>
                                      Singapore, Singapore
                                      <br>
                                      <small class="text-info">
                                        25 murtual friends
                                      </small>
                                    </p>
                                  </div>
                                  <!-- /.com-sm-6 -->
                                  <div class="col-sm-4">
                                    <button class="btn btn-success btn-sm">
                                      <i class="fa fa-user">
                                      </i>
                                      Add friend
                                    </button>
                                    <button class="btn btn-info btn-sm">
                                      <i class="fa fa-envelope">
                                      </i>
                                      Message
                                    </button>
                                  </div>
                                </div>
                                <!-- /.row -->
                              </div>
                            </li>
                          </ul>
                          <hr>
                          <!-- Pagination success -->
                          <ul class="pagination success">
                            <li class="disabled">
                              <a href="#fakelink">
                                «
                              </a>
                            </li>
                            <li class="disabled">
                              <a href="#fakelink">
                                ‹
                              </a>
                            </li>
                            <li class="active">
                              <a href="#fakelink">
                                1
                              </a>
                            </li>
                            <li>
                              <a href="#fakelink">
                                2
                              </a>
                            </li>
                            <li>
                              <a href="#fakelink">
                                ...
                              </a>
                            </li>
                            <li>
                              <a href="#fakelink">
                                20
                              </a>
                            </li>
                            <li>
                              <a href="#fakelink">
                                ›
                              </a>
                            </li>
                            <li>
                              <a href="#fakelink">
                                »
                              </a>
                            </li>
                          </ul>
                        </div>
                        <!-- /.tab-pane fade -->
                      </div>
                      <!-- /.tab-content -->
                    </div>
                    <!-- /.panel-body -->
                  </div>
                  <!-- /.collapse in -->
                </div>
              </div>
            </section>
          </section>
		  <!-- END WRAPPER  -->
        </section>
        <!-- END MAIN CONTENT -->
        <!-- BEGIN FOOTER -->
        
        <footer class="site-footer">
          <div class="text-center">
            2013 &copy; Olive Admin by 
            <a href="" target="_blank">
              Custom Theme
            </a>
            .
            <a href="http://www.mycodes.net" class="go-top">
              <i class="fa fa-angle-up">
              </i>
            </a>
          </div>
        </footer>
        <!-- END FOOTER -->
     </section>
     <!-- END SECTION -->
     
     <!-- BEGIN JS -->
		<script src="js/jquery.js" ></script><!-- BASIC JS LIABRARY -->
		<script src="js/bootstrap.min.js" ></script><!-- BOOTSTRAP JS  -->
		<script src="js/jquery.dcjqaccordion.2.7.js"></script><!-- ACCORDING JS -->
		<script src="js/jquery.scrollTo.min.js" ></script><!-- SCROLLTO JS  -->
		<script src="js/jquery.nicescroll.js" > </script><!-- NICESCROLL JS  -->
		<script src="js/respond.min.js" ></script><!-- RESPOND JS  -->
		<script src="js/common-scripts.js" ></script><!-- BASIC COMMON JS  -->
     <!-- END JS -->
  </body>
</html>


